<!-- 考勤列表 -->
<template>
	<view >
		<scroll-view scroll-y="true" class="container">
			<view v-if="dataList.length>=1">
				<view class="listItem" v-for="item in dataList" >
					<view style="width: 150rpx;">
						<text style=" color:#333;" v-if="showType == '1'">出勤日期</text>
						<text style=" color:#333;" v-if="showType == '2'">迟到日期</text>
						<text style=" color:#333;" v-if="showType == '3'">早退日期</text>
						<text style=" color:#333;" v-if="showType == '4'">旷工日期</text>
						<text style=" color:#333;" v-if="showType == '5'">缺卡日期</text>
						<text style=" color:#333;" v-if="showType == '6'">请假日期</text>
					</view>
					<view v-if="item.day" style="margin-left: 0rpx;">{{item.day}}</view>
					<view v-if="item.add_time">{{item.add_time}}</view>
					<view v-if="item.time">{{item.time}}</view>
					<view v-if="showType == '6'">
						<view>{{item.start_time + ' 至 ' + item.end_time}}</view>
						<!-- <view>{{}}</view> -->
					</view>
					<view v-if="showType != '6'">{{'星期'+item.week}}</view>
				</view>
			</view>
			<view v-else class="emptyData">暂无数据</view>
		</scroll-view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			token: '',
			member_id: '',
			company_id: '',
			nickname: '',
			avatarUrl: '',
			// 按月统计详情
			indexData: {},
			// 签到详情
			punchDetails: {},
			selectedDate: '',
			selectedMounth: '',
			dataList: [],
			showType: '',
			user_id:'',
		};
	},
	onLoad(options) {
		this.dataList = []
		this.token = uni.getStorageSync('btlh_process_token') || '';
		this.member_id = uni.getStorageSync('btlh_process_member_id') || '';
		this.company_id = uni.getStorageSync('bthl_process_LoginCompanyId') || '';
		this.selectedMounth = options.month || '';
		this.user_id = options.user_id || this.member_id;
		
		console.log(this.selectedMounth);
		console.log(options);
		// uni.setNavigationBarTitle({
		// 		title:'个人中心'
		// })
		if (options.type == '1') {
			uni.setNavigationBarTitle({
				title: '出勤列表'
			});
			this.showType = '1'
			this.getList1()
		} else if (options.type == '2') {
			uni.setNavigationBarTitle({
				title: '迟到列表'
			});
			this.showType = '2'
			this.getList2()
		} else if (options.type == '3') {
			uni.setNavigationBarTitle({
				title: '早退列表'
			});
			this.showType = '3'
			this.getList3()
		} else if (options.type == '4') {
			uni.setNavigationBarTitle({
				title: '缺勤列表'
			});
			this.showType = '4'
			this.getList4()
		} else if (options.type == '5') {
			uni.setNavigationBarTitle({
				title: '缺卡列表'
			});
			this.showType = '5'
			this.getList5()
		} else if (options.type == '6') {
			uni.setNavigationBarTitle({
				title: '请假列表'
			});
			this.showType = '6'
			this.getList6()
		}
		this.nickname = uni.getStorageSync('btlh_process_nickname') || '';
		this.avatarUrl = uni.getStorageSync('btlh_process_avatarUrl') || '';
	},
	methods: {
		// 获取出勤列表
		// 获取出勤列表
		async getList1() {
			const { data: res } = await this.$myRequest({
				url: 'ClockInStatistics/attendance_list',
				method: 'POST',
				data: {
					member_id: this.member_id,
					token: this.token,
					company_id: this.company_id,
					user_id:this.user_id,
					month: this.selectedMounth
				}
			});
			if (res.code != 200)
				return uni.showToast({
					title: res.datas.msg,
					icon: 'none'
				});
			this.dataList = res.datas.data;
			console.log('获取出勤列表 详情', this.indexData);
		},
		async getList1() {
			const { data: res } = await this.$myRequest({
				url: 'ClockInStatistics/attendance_list',
				method: 'POST',
				data: {
					member_id: this.member_id,
					token: this.token,
					company_id: this.company_id,
					user_id:this.user_id,
					month: this.selectedMounth
				}
			});
			if (res.code != 200)
				return uni.showToast({
					title: res.datas.msg,
					icon: 'none'
				});
			this.dataList = res.datas.data;
			console.log('出勤列表 详情', this.dataList);
		},
		// 获取迟到 列表
		async getList2() {
			const { data: res } = await this.$myRequest({
				url: 'ClockInStatistics/late_list',
				method: 'POST',
				data: {
					member_id: this.member_id,
					token: this.token,
					company_id: this.company_id,
					user_id:this.user_id,
					month: this.selectedMounth
				}
			});
			if (res.code != 200)
				return uni.showToast({
					title: res.datas.msg,
					icon: 'none'
				});
			this.dataList = res.datas.data;
			console.log('迟到列表 详情', this.dataList);
		},
		// 获取早退 列表
		async getList3() {
			const { data: res } = await this.$myRequest({
				url: 'ClockInStatistics/early_list',
				method: 'POST',
				data: {
					member_id: this.member_id,
					token: this.token,
					company_id: this.company_id,
					user_id:this.user_id,
					month: this.selectedMounth
				}
			});
			if (res.code != 200)
				return uni.showToast({
					title: res.datas.msg,
					icon: 'none'
				});
			this.dataList = res.datas.data;
			console.log('早退列表 详情', this.dataList);
		},
		// 获取旷工 列表
		async getList4() {
			const { data: res } = await this.$myRequest({
				url: 'ClockInStatistics/absenteeism_list',
				method: 'POST',
				data: {
					member_id: this.member_id,
					token: this.token,
					company_id: this.company_id,
					user_id:this.user_id,
					month: this.selectedMounth
				}
			});
			if (res.code != 200)
				return uni.showToast({
					title: res.datas.msg,
					icon: 'none'
				});
			this.dataList = res.datas.data;
			console.log('旷工列表 详情', this.dataList);
		},
		// 获取补卡 列表
		async getList5() {
			const { data: res } = await this.$myRequest({
				url: 'ClockInStatistics/card_replacement_list',
				method: 'POST',
				data: {
					member_id: this.member_id,
					token: this.token,
					company_id: this.company_id,
					user_id:this.user_id,
					month: this.selectedMounth
				}
			});
			if (res.code != 200)
				return uni.showToast({
					title: res.datas.msg,
					icon: 'none'
				});
			this.dataList = res.datas.data;
			console.log('补卡列表 详情', this.dataList);
		},
		// 获取请假 列表
		async getList6() {
			const { data: res } = await this.$myRequest({
				url: 'ClockInStatistics/leave_list',
				method: 'POST',
				data: {
					member_id: this.member_id,
					token: this.token,
					company_id: this.company_id,
					user_id:this.user_id,
					month: this.selectedMounth
				}
			});
			if (res.code != 200)
				return uni.showToast({
					title: res.datas.msg,
					icon: 'none'
				});
			this.dataList = res.datas.data;
			console.log('请假列表 详情', this.dataList);
		}
	}
};
</script>

<style lang="scss" scoped>
	.container{
		box-sizing: border-box;
		padding: 0 20rpx;
		.listItem{
			font-size: 26rpx;
			width: 100%;
			border-bottom: 1px solid #ddd;
			display: flex;
			align-items: center;
			justify-content: space-between;
			color: #888;
			padding: 20rpx 0rpx;
		}
	}
	.emptyData{
		text-align: center;
		margin-top: 50rpx;
		color: #888;
	}
</style>
